<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>类型化数组</title>
</head>

<body>
  <script>
    /* 
      类型化数组
      是一种处理二进制数据的特殊数组，类似C语言直接操作字节
      步骤：
        1.用ArrayBuffer对象创建数组缓冲区
        2.再映射到指定格式的视图（view）
          —— 特定类型 TypedArray
          —— 通用类型 DataView
        3.读写其中的数据

      https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer
    */

    // 1.ArrayBuffer
    /* 
      用来创建一个固定大小的内存区域（数组缓冲区）
    */

    var buffer = new ArrayBuffer(8)
        console.log(buffer.byteLength)
        buffer.slice(2, 4);
        ArrayBuffer.isView(buffer)


    // 2.TypedArray
    /* 
      类型化数组有以下几种：

      名称	              占用字节	描述
      Int8Array	1	8位二补码有符号整数
      Uint8Array	1	8位无符号整数
      Uint8ClampedArray	1	8位无符号整型固定数组(数值在0~255之间)
      Int16Array	2	16位二补码有符号整数
      Uint16Array	2	16位无符号整数
      Int32Array	4	32 位二补码有符号整数
      Uint32Array	4	32 位无符号整数
      Float32Array	4	32 位 IEEE 浮点数
      Float64Array	8	64 位 IEEE 浮点数


      Int 为整型，
      Uint 为无符号数，
      Float 为浮点型，一个字节占八位，解析数据以"字节"为基础单位，无法直接读取位（不知道是不是这样，反正我是没找到方法）。
      解析数据的时候要了解数据的存储格式。

      单一类型数据

      混编类型数据

    */
    
    // 单一类型数据可用对应的类型化数组直接进行解析：

    var array = new Uint8Array(buffer);
    for(var i = 0; i < array.length; ++i){
      console.log(array[i])
    }

    
    // 混编类型数据解析需要用移位的方式解析其中对应类型的数据：

    var array = new Uint8Array(buffer, byteOffset, length)
    for(var i = 0; i < array.length; ++i){
      console.log(array[i])
    }

    /* 
      初始化数组的时候用第二个和第三个参数截取某段数据，生成相应类型的数据，
      其中第二个参数表示偏移的字节数，第三个参数表示数组长度。 
    */

    // DataView
    /*     
      DataView视图是一个可以从对象中读写多种数值类型的底层接口，使用它时，不用考虑不同平台的字节序问题。 
    */

    // var dataView = new DataView(buffer, byteOffset , byteLength);
    /* 
      DataView中提供了各种类型数据的get和set方法，通过这些方法可以更加直观的操作TypedArray，
      关于其中的各方法的详细解释，请参见MDN web doc。
      https://developer.mozilla.org/zh-CN/

      DataView的get方法中除了get一个字节的数据外，
      均含有第二个可选参数littleEndian，指示数据是以小端还是大端格式存储。
      如果为false或未定义，则偏移位是按照元素偏移的。
      设置为true时，则偏移位是按照字节数偏移的（个人见解。可能有误）。 
    */


  </script>
</body>

</html>